"use strict";

/**
 * @auther wtfssd
 * Created by wtfssd on 2017/10/31
 */
import * as React from 'react'
import {LineProps} from "../interface/index";
import {SCREEN_WIDTH} from "../constant";

const {View,  ART} = require('react-native');
const {Surface,Shape,Path } = ART;

class Line extends React.Component<LineProps, any> {
    static defaultProps = {
        width: SCREEN_WIDTH,
        height: 0.5,
        color: '#D0D0D0',
        style: null,
        type: 'solid'
    };

    getStyle() {
        const {width, height, color, style, type} = this.props;

        let _style = {};

        if (type === 'dashed') {
            _style['width'] = width;
            _style['borderColor'] = color;
            _style['borderStyle']=type;
            _style['borderWidth']=0.5;
        } else {
            _style['width'] = width;
            _style['height'] = height;
            _style['backgroundColor'] = color
        }
        return _style;
    };

    render() {
        const {width, height, color, style, type} = this.props;
        const path = Path(`M0 0 H${width}`).close();
        let strokeDash=[0,0];
        if(type === 'dashed'){
            strokeDash=[10,5];
        }else if(type === 'dotted'){
            strokeDash=[1,2];
        }
        return (
            <View style={[{width,height, backgroundColor:color},style]}>
                <Surface width={width} height={height}>
                    <Shape d={path}  strokeDash={strokeDash}/>
                </Surface>
            </View>
        )
    }
}

export default Line;